<template>
  <el-card shadow="never" class="aui-card--fill">
    <div class="mod-demand__bsdemand">
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
        <el-form-item>
          <el-select v-model="dataForm.pcode" placeholder="目录级别">
            <el-option label="选择" value="0"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-input v-model="dataForm.name" placeholder="名称" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <el-input v-model="dataForm.context" placeholder="内容" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <el-input v-model="dataForm.suggest" placeholder="建议
" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <el-input v-model="dataForm.descripition" placeholder="描述" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <el-button @click="getDataList()">{{ $t('query') }}</el-button>
        </el-form-item>
        <el-form-item>
          <el-button type="info" @click="exportHandle()">{{ $t('export') }}</el-button>
        </el-form-item>
        <el-form-item>
          <el-button v-if="$hasPermission('demand:bsdemand:save')" type="primary" @click="addOrUpdateHandle()">需求申请</el-button>
        </el-form-item>
        <el-form-item>
          <el-button v-if="$hasPermission('demand:bsdemand:delete')" type="danger" @click="deleteHandle()">{{ $t('deleteBatch') }}</el-button>
        </el-form-item>
      </el-form>
      <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%;">
        <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
        <el-table-column prop="pcode" label="目录级别" width="100" header-align="center" align="center"></el-table-column>
        <el-table-column prop="name" label="需求名称" width="150" header-align="center" align="center"></el-table-column>
        <el-table-column prop="context" label="需求内容" header-align="center" align="left">
          <template #default="{ row }">
            <span>{{row.context.length > 40 ? row.context.slice(0, 40) + '...' : row.context}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="suggest" label="需求建议" header-align="center" align="left">
          <template #default="{ row }">
            <span>{{row.suggest.length > 40 ? row.suggest.slice(0, 40) + '...' : row.suggest}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="descripition" label="能力描述" header-align="center" align="left">
          <template #default="{ row }">
            <span>{{row.descripition.length > 40 ? row.descripition.slice(0, 40) + '...' : row.descripition}}</span>
          </template>
        </el-table-column>
        <!-- <el-table-column prop="images" label="图片" header-align="center" align="center"></el-table-column> -->
        <el-table-column prop="opinion" label="驳回理由" width="150"  header-align="center" align="center" >
          <template #default="{row}">
            <span>{{+row.state === 2 ? row.opinion : '--'}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="state" label="状态"  width="80" header-align="center" align="center" :formatter="stateFormatter"></el-table-column>
        <el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="80">
          <template slot-scope="scope">
            <!-- <el-button v-if="$hasPermission('bsdemand:examine')"  type="text" size="small" @click="handleExamine(scope.row)">审核</el-button> -->
            <el-button v-if="$hasPermission('bsdemand:update')" type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button>
            <!-- <el-button v-if="$hasPermission('bsdemand:delete')" type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button> -->
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        :current-page="page"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="limit"
        :total="total"
        layout="total, sizes, prev, pager, next, jumper"
        @size-change="pageSizeChangeHandle"
        @current-change="pageCurrentChangeHandle">
      </el-pagination>
      <!-- 弹窗, 新增 / 修改 -->
      <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
    </div>
  </el-card>
</template>

<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './bsdemand-add-or-update'
export default {
  mixins: [mixinViewModule],
  data () {
    return {
      mixinViewModuleOptions: {
        getDataListURL: '/demand/bsdemand/page',
        getDataListIsPage: true,
        exportURL: '/demand/bsdemand/export',
        deleteURL: '/demand/bsdemand',
        deleteIsBatch: true
      },
      dialogVisible: false,
      dataForm: {
        pcode: '',
        name: '',
        context: '',
        suggest: '',
        descripition: ''
      }
    }
  },
  watch: {
  },
  components: {
    AddOrUpdate
  },
  methods: {
    stateFormatter (row, column, cellValue, index) {
      const value = +cellValue
      return value === 0 ? '审核中' : value === 1 ? '已通过' : '被驳回'
      // if(cellValue == 1){
      //   return "审核通过"
      // }else if(cellValue == 0){
      //   return '待审'
      // }else{
      //   return '驳回'
      // }
    },
    handleExamine (row) {
      this.$router.push('/demand-deman')
    }
  }
}
</script>
